﻿var array1 = [{
  'name': '南昌市恩惠医用卫生',
  'id': 'GJYJBT1',
  'level': '1',
  'purchaseDate': '2017-03-02',
  'parentId': 'YKBF'
}]




var array3 = [{
    'name': '新疆神木药业有限公司',
    'id': 'JHSJ',
    'level': '3',
    'purchaseDate': '2017-03-21',
    'inventory': '23',
    'children': [{
      'name': '1111111',
      'id': '122',
      'purchaseDate': '2017-03-21',
      'inventory': '23',
    }]
  }

]


var array5 = [{
    'name': '杭州食品商行',
    'id': 'HZSPSH',
    'level': '5',
    'purchaseDate': '2017-03-21',
    'inventory': '23',
  },
  {
    'name': '杭州食品商行',
    'id': 'HZSPSH',
    'level': '5',
    'purchaseDate': '2017-03-21',
    'inventory': '23',
  }
]

function addChildren(data) {
  var _this = this
  var childrenLevel = 0
  var html = ''
  if (_this.children('ul').length == 0) {
    _this.append('<ul></ul>')
  }
  var $ul = $(_this.children('ul')[0])
  $ul.html('')
  for (var i = 0; i < data.length; i++) {
    var item = data[i]
    var level = item.level
    if (level && level == 1) {
      childrenLevel = 1
      html = '<li class="produce " data-level="' + item.level + '" data-id=\'' + item.id + '\'>' + '<div>' +
        '<span class=\'icon\'></span>' +
        '<span class="produceCorner"></span>' +
        '<div class=\'innerText\'>' +
        '<span class="sub name">' + '<span class="tiit">' + item.name + '</span>' +
        ' <div class="hover-box">' +
        '<table>' +
        ' <tbody>' +
        '   <tr>' +
        '     <td class="tit" colspan="2">医用棉签</td>' +
        '   </tr>' +
        '    <tr>' +
        '     <td>批准文号：</td>' +
        '    <td>国药准字Z45021535</td>' +
        '   </tr>' +
        '  <tr>' +
        '    <td>有效期至：</td>' +
        '     <td>2018-05-05</td>' +
        '    </tr>' +
        '  <tr>' +
        '    <td>产品规格：</td>' +
        '    <td>B型5cm</td>' +
        '   </tr>' +
        '  <tr>' +
        '  <td>产品单位：</td>' +
        '  <td>盒</td>' +
        ' </tr>' +
        '</tbody>' +
        '</table>' +
        '</div>' +

        '</span>' +
        '<div class="sub">' + '生产日期：' + item.purchaseDate + '</div>' +
        // '<div class="sub">' + '批次：' + item.batch + '</div>' +
        '</div>' +

        '</div>' +
        '</li>'
      $ul.append(html)
    } else if (level && level == 3) {
      childrenLevel = 3
      var childrenHtml = $('<ul></ul>')
      var childHtml = '';
      if (item.children && item.children.length >= 1) {
        $.each(item.children, function (index, value) {
          childHtml += '<li class="provide provide-arrow">' + '<div>' +
            // '<span class=\'icon\'></span>' +
            '<span class="provideCorner"></span>' +
            '<div class=\'innerText\'>' +
            '<span class="sub name">' + '<span class="tiit">' + item.name + '</span>' +
            ' <div class="hover-box">' +
            '<table>' +
            ' <tbody>' +
            '   <tr>' +
            '     <td class="tit" colspan="2">医用棉签</td>' +
            '   </tr>' +
            '    <tr>' +
            '     <td>批准文号：</td>' +
            '    <td>国药准字Z45021535</td>' +
            '   </tr>' +
            '  <tr>' +
            '    <td>有效期至：</td>' +
            '     <td>2018-05-05</td>' +
            '    </tr>' +
            '  <tr>' +
            '    <td>产品规格：</td>' +
            '    <td>B型5cm</td>' +
            '   </tr>' +
            '  <tr>' +
            '  <td>产品单位：</td>' +
            '  <td>盒</td>' +
            ' </tr>' +
            '</tbody>' +
            '</table>' +
            '</div>' +

            '</span>' +
            '<div class="sub">' + '进货日期：' + item.purchaseDate + '</div>' +
            '<div class="sub">' + '库存：' + item.inventory + '</div>' +
            '</div>' +

            '</div>' +
            '</li>'
        })
      }
      $ul.html('<span  id="add-list" class=\'bottom-icon\'></span>')
      html = '<li class="purchase hasChild purchase-arrow" data-level="' + item.level + '"  data-id=\'' + item.id + '\'>' + '<div>' +
        '<span class=\'icon\'></span>' +

        // '<span class="purchaseCorner"></span>' +
        '<div class=\'innerText\'>' +
        '<span class="name">' + '<span class="tiit">' + item.name + '</span>' +
        ' <div class="hover-box">' +
        '<table>' +
        ' <tbody>' +
        '   <tr>' +
        '     <td class="tit" colspan="2">医用棉签</td>' +
        '   </tr>' +
        '    <tr>' +
        '     <td>批准文号：</td>' +
        '    <td>国药准字Z45021535</td>' +
        '   </tr>' +
        '  <tr>' +
        '    <td>有效期至：</td>' +
        '     <td>2018-05-05</td>' +
        '    </tr>' +
        '  <tr>' +
        '    <td>产品规格：</td>' +
        '    <td>B型5cm</td>' +
        '   </tr>' +
        '  <tr>' +
        '  <td>产品单位：</td>' +
        '  <td>盒</td>' +
        ' </tr>' +
        '</tbody>' +
        '</table>' +
        '</div>' +

        '</span>' +
        '<div class="sub">' + '进货日期：' + item.purchaseDate + '</div>' +
        '<div class="sub">' + '库存：' + item.inventory + '</div>' +
        // '<span>' + item.purchaseDate + '</span>' +

        '</div>' +

        '</div>' +
        '</li>' + childHtml

      $ul.append(html)
    } else if (level && level == 5) {
      childrenLevel = 5
      html = '<li class="sale" data-level="' + item.level + '" data-id=\'' + item.id + '\'>' + '<div>' +
        '<span class=\'icon\'></span>' +
        '<span class="saleCorner"></span>' +
        '<div class=\'innerText\'>' +
        '<span class="name">' + '<span class="tiit">' + item.name + '</span>' +
        ' <div class="hover-box">' +
        '<table>' +
        ' <tbody>' +
        '   <tr>' +
        '     <td class="tit" colspan="2">医用棉签</td>' +
        '   </tr>' +
        '    <tr>' +
        '     <td>批准文号：</td>' +
        '    <td>国药准字Z45021535</td>' +
        '   </tr>' +
        '  <tr>' +
        '    <td>有效期至：</td>' +
        '     <td>2018-05-05</td>' +
        '    </tr>' +
        '  <tr>' +
        '    <td>产品规格：</td>' +
        '    <td>B型5cm</td>' +
        '   </tr>' +
        '  <tr>' +
        '  <td>产品单位：</td>' +
        '  <td>盒</td>' +
        ' </tr>' +
        '</tbody>' +
        '</table>' +
        '</div>' +

        '</span>' +
        '<div class="sub">' + '进货日期：' + item.purchaseDate + '</div>' +
        '<div class="sub">' + '库存：' + item.inventory + '</div>' +
        '</div>' +

        '</div>' +
        '</li>'
      $ul.append(html)
    }

  }

  if (childrenLevel == '1') {
    $ul.css('margin-top', 10)
  } else {
    moveToRight.call($ul)
  }
  $('#add-list').on('click', function () {
    var _html = '<li class="provide provide-arrow-append">' + '<div>' +
      // '<span class=\'icon\'></span>' +
      '<span class="provideCorner"></span>' +
      '<div class=\'innerText\'>' +
      '<span class="sub name">' + '<span class="tiit">' + 23 + '</span>' +
      ' <div class="hover-box">' +
      '<table>' +
      ' <tbody>' +
      '   <tr>' +
      '     <td class="tit" colspan="2">医用棉签</td>' +
      '   </tr>' +
      '    <tr>' +
      '     <td>批准文号：</td>' +
      '    <td>国药准字Z45021535</td>' +
      '   </tr>' +
      '  <tr>' +
      '    <td>有效期至：</td>' +
      '     <td>2018-05-05</td>' +
      '    </tr>' +
      '  <tr>' +
      '    <td>产品规格：</td>' +
      '    <td>B型5cm</td>' +
      '   </tr>' +
      '  <tr>' +
      '  <td>产品单位：</td>' +
      '  <td>盒</td>' +
      ' </tr>' +
      '</tbody>' +
      '</table>' +
      '</div>' +

      '</span>' +
      '<div class="sub">' + '进货日期：' + 123 + '</div>' +
      '<div class="sub">' + '库存：' + 123 + '</div>' +
      '</div>' +

      '</div>' +
      '</li>'

    $(this).parent('ul').append(_html)
  })
  $ul.find('>li >div>.icon').on('click', function (e) {
    e.stopPropagation()

    $(this).toggleClass('icon-open')
    var $root = $(this).parent('div').parent('li')
    if (!$(this).data('added')) {
      var data = getChildrenData.call($root)
      // var data = $root.getChildrenData()
      if (data.length) {
        addChildren.call($root, data)
        // $root.addChildren(data)
        $(this).data('added', true)
        $root.find('>ul>li:visible').hide()
      } else {
        $(this).remove()
      }

    }

    var children = $root.find(' > ul > li')
    var siblingLis = $root.siblings()

    if (children.is(':visible')) {
      children.hide('fast')
    } else {
      children.show('fast')
      siblingLis.find(' > ul > li').hide()
      siblingLis.find('>div>.icon').removeClass('icon-open')
    }

  })

  $('li ul').each(function () {
    $(this).find('>li:last-child').addClass('after-none')
  })
}

function getChildrenData() {
  // debugger
  var _this = this
  var level = _this.data('level')
  var parentId = _this.data('id')
  var ret = []
  if (level == 0) {
    ret = array1
  } else if (level == 1 && parentId == 'GJYJBT') {
    ret = array2
  } else if (level == 1) {
    ret = array3
  } else if (level == 3) {
    ret = array5
  } else if (level == 5) {
    ret = array5
  }
  return ret
}

function moveToRight() {

  var RECTANGLE_WIDTH = 180
  var RECTANGLE_INTERVAL = 33

  $(this).css({
    'position': 'absolute',
    'top': -2,
    'margin-left': RECTANGLE_WIDTH + RECTANGLE_INTERVAL
  })
}